<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>爱奇艺-电影</title>
    <link rel="stylesheet" href="./css/Test.css">
</head>

<body>
    <div class="container">

        <ul class="guide">
            <li>电影</li>
            <li>动作</li>
            <li>搞笑</li>
            <li>剧情</li>
            <li>科幻</li>
            <li>青春</li>
            <li>爱情</li>
            <li>&nbsp;&nbsp;&nbsp;其他 ></li>
        </ul>

        <ul class="movie-list">
            <li class="movie-box">
                <div class="normal">
                    <!-- 图片 -->
                    <div>
                        <img src="./images/三叉戟.webp" alt="">
                        <h4 class="dubo">独播</h4>
                    </div>
                    <!-- 电影名称 -->
                    <h3>三叉戟</h3>
                    <!-- 描述 -->
                    <p>5.4万人已预约</p>
                </div>
                <div class="switch">
                    <div class="up">
                        <img src="./images/三叉戟1.jpg" alt="">
                    </div>
                    <div class="down">
                        <h3 class="txt-title">三叉戟</h3>
                        <p class="cent">8.6</p>
                        <ul class="txt-list">
                            <li>警匪</li>
                            <li>犯罪</li>
                            <li>扫黑</li>
                        </ul>
                        <p class="txt-desc">
                            2024 / 内地 / 黄志忠 / 姜武 / 郭涛
                        </p>
                        <a class="button" href="#">▶&nbsp;&nbsp;看正片</a>
                        <img src="./images/star(ready).png" alt="">
                    </div>
                </div>
            </li>

            <li class="movie-box">
                <div class="normal">
                    <!-- 图片 -->
                    <div>
                        <img src="./images/狙击精英.webp" alt="">
                        <h4 class="biu">VIP</h4>
                    </div>
                    <!-- 电影名称 -->
                    <h3>狙击精英之纳米危机</h3>
                    <!-- 描述 -->
                    <p>1.0万人已预约</p>
                </div>
                <div class="switch">
                    <div class="up">
                        <img src="./images/狙击精英1.jpg" alt="">
                    </div>
                    <div class="down">
                        <h3 class="txt-title">狙击精英之纳米危机</h3>
                        <p class="cent">7.6</p>
                        <ul class="txt-list">                           
                            <li>犯罪</li>
                            <li>动作</li>
                            <li>枪战</li>
                            <li>硬汉</li>
                        </ul>
                        <p class="txt-desc">
                            2024 / 内地 / 高世名 / 李恰 / 艾科 / 孙文雪                           
                        </p>
                        <a class="button" href="#">▶&nbsp;&nbsp;看正片</a>
                        <img src="./images/star(ready).png" alt="">
                    </div>
                </div>
            </li>

            <li class="movie-box">
                <div class="normal">
                    <!-- 图片 -->
                    <div>
                        <img src="./images/雾隐藏棺.webp" alt="">
                    </div>
                    <!-- 电影名称 -->
                    <h3>棺中诡事之雾隐藏棺</h3>
                    <!-- 描述 -->
                    <p>1523人已预约</p>
                </div>
                <div class="switch">
                    <div class="up">
                        <img src="./images/雾隐藏棺1.webp" alt="">
                    </div>
                    <div class="down">
                        <h3 class="txt-title">棺中诡事之雾隐藏棺</h3>
                        <p class="cent">8.0</p>
                        <ul class="txt-list">                           
                            <li>动作</li>
                            <li>奇幻</li>
                            <li>冒险</li>
                            <li>寻宝</li>
                        </ul>
                        <p class="txt-desc">
                            2024 / 内地 / 克拉拉 / 张维伊 / 骆达华 / 蒲萄                           
                        </p>
                        <a class="button" href="#">▶&nbsp;&nbsp;看正片</a>
                        <img src="./images/star(ready).png" alt="">
                    </div>
                </div>
            </li>

            <li class="movie-box">
                <div class="normal">
                    <!-- 图片 -->
                    <div>
                        <img src="./images/我才不要和你做朋友呢.webp" alt="">
                    </div>
                    <!-- 电影名称 -->
                    <h3>我才不要和你做朋友呢</h3>
                    <!-- 描述 -->
                    <p>16.2万人已预约</p>
                </div>
                <div class="switch">
                    <div class="up">
                        <img src="./images/我才不要和你做朋友呢1.jpg" alt="">
                    </div>
                    <div class="down">
                        <h3 class="txt-title">我才不要和你做朋友呢</h3>
                        <p class="cent">8.4</p>
                        <ul class="txt-list">                           
                            <li>戏剧</li>
                            <li>剧情</li>
                            <li>穿越</li>
                        </ul>
                        <p class="txt-desc">
                            2024 / 内地 / 庄达菲                           
                        </p>
                        <a class="button" href="#">▶&nbsp;&nbsp;看正片</a>
                        <img src="./images/star(ready).png" alt="">
                    </div>
                </div>
            </li>

            <li class="movie-box">
                <div class="normal">
                    <!-- 图片 -->
                    <div>
                        <img src="./images/功夫熊猫.webp" alt="">
                        <h4 class="dubo">独播</h4>
                    </div>
                    <!-- 电影名称 -->
                    <h3>功夫熊猫4</h3>
                    <!-- 描述 -->
                    <p>46.7万人已预约</p>
                </div>
                <div class="switch">
                    <div class="up">
                        <img src="./images/功夫熊猫1.jpg" alt="">
                    </div>
                    <div class="down">
                        <h3 class="txt-title">功夫熊猫4</h3>
                        <p class="cent">9.5</p>
                        <ul class="txt-list">                           
                            <li>动作喜剧</li>
                            <li>戏剧</li>
                            <li>动作</li>
                            <li>动画</li>
                        </ul>
                        <p class="txt-desc">
                            2024 / 英语 / 杰克·布莱克 / 奥卡菲娜 / 关继戚 / 维奥拉·戴维斯                           
                        </p>
                        <a class="button" href="#">▶&nbsp;&nbsp;看正片</a>
                        <img src="./images/star(ready).png" alt="">
                    </div>
                </div>
            </li>

            <li class="movie-box">
                <div class="normal">
                    <!-- 图片 -->
                    <div>
                        <img src="./images/扫黑.webp" alt="">
                        <h4 class="biu">VIP</h4>
                    </div>
                    <!-- 电影名称 -->
                    <h3>扫黑·决不放弃</h3>
                    <!-- 描述 -->
                    <p>32.7万人已预约</p>
                </div>
                <div class="switch">
                    <div class="up">
                        <img src="./images/扫黑1.jpg" alt="">
                    </div>
                    <div class="down">
                        <h3 class="txt-title">扫黑·决不放弃</h3>
                        <p class="cent">9.3</p>
                        <ul class="txt-list">                           
                            <li>犯罪</li>
                            <li>警匪</li>
                            <li>悬疑</li>
                        </ul>
                        <p class="txt-desc">
                            2024 / 内地 / 肖央 / 余皑磊 / 范丞丞 / 李诚儒                           
                        </p>
                        <a class="button" href="#">▶&nbsp;&nbsp;看正片</a>
                        <img src="./images/star(ready).png" alt="">
                    </div>
                </div>
            </li>
        </ul>
    </div>
</body>

</html>